<script lang="ts" setup>
import { reactive } from 'vue'
import { getlist, postTest } from '../assets/api/test'
import { useRouter } from 'vue-router'
interface datalist {
  name: string
  password: string
}
const event: datalist = reactive({
  name: '',
  password: ''
})
const router = useRouter()
const login = function() {
  postTest('/test', event).then(res => {
    // if (res.data.login === 1) {
    //   router.push({path:'/index/index'})
    // }
  })
}
</script>
<template>
  <div class="login-layout">
    <div class="nav">
      <div class="nav-center">
        <el-form label-position="right" label-width="100px">
          <el-form-item label="账号">
            <el-input style="width:300px" v-model="event.name"></el-input>
          </el-form-item>
          <el-form-item label="密码">
            <el-input style="width:300px" v-model="event.password"></el-input>
          </el-form-item>
          <div style="display:flex;margin-left:100px">
            <el-button style="width:300px" @click="login">登录</el-button>
          </div>
        </el-form>
      </div>
    </div>
  </div>
</template>

<style lang="scss">
.login-layout {
  width: 100%;
  height: 100%;
  // background: url('../../src/assets/img/bg.png');
  .nav {
    width: 50%;
    min-width: 375px;
    position: absolute;
    transform: translate(-50%, -50%);
    left: 50%;
    top: 50%;
    display: flex;
    justify-content: center;
    align-content: center;
    .nav-center {
      width: 500px;
      .el-form-item__label {
        color: white;
      }
    }
  }
}
</style>
